Add assignment submission

2 files changed, 56 insertions, 4 deletions

diff --git a/app/src/routes/assignments/[assignmentId]/+page.server.ts b/app/src/routes/assignments/[assignmentId]/+page.server.ts
index 566dcd9..280c5bd 100644
--- a/app/src/routes/assignments/[assignmentId]/+page.server.ts
+++ b/app/src/routes/assignments/[assignmentId]/+page.server.ts
@@ -1,5 +1,5 @@
-import { getAssignmentAndCemetaryById } from "$lib/server/assignments";
-import type { PageServerLoad } from "./$types";
+import { finishAssignment, getAssignmentAndCemetaryById } from "$lib/server/assignments";
+import type { PageServerLoad, Actions } from "./$types";
 import { error, redirect } from "@sveltejs/kit";
 
 export const load = (async ({ params, url, locals }) => {
@@ -25,3 +25,29 @@ export const load = (async ({ params, url, locals }) => {
 		cemetaryPlot,
 	};
 }) satisfies PageServerLoad;
+
+export const actions = {
+	// FIXME: Skipped input validation.
+	// FIXME: Is 'load' action run (wrt. authentication)?
+	finish: async ({ params, request, locals }) => {
+		const formData = await request.formData();
+		const imageFiles = formData.getAll("images") as File[];
+		const note = (formData.get("note") as string | null) ?? undefined;
+
+		// Read image files in parallel.
+		const images = await Promise.all(
+			imageFiles.map(async (f) => ({
+				name: f.name,
+				bytes: new Uint8Array(await f.arrayBuffer()),
+			})),
+		);
+
+		await finishAssignment(locals.dbConn, locals.s3Client, {
+			images,
+			note,
+			assignmentId: +params.assignmentId, // We have parsing at home...
+		});
+
+		return { success: true };
+	},
+} satisfies Actions;
diff --git a/app/src/routes/assignments/[assignmentId]/+page.svelte b/app/src/routes/assignments/[assignmentId]/+page.svelte
index 0b36a19..9cf9890 100644
--- a/app/src/routes/assignments/[assignmentId]/+page.svelte
+++ b/app/src/routes/assignments/[assignmentId]/+page.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
+	import { enhance } from "$app/forms";
 	import type { PageProps } from "./$types";
+	import { canBeFinished } from "$lib/common/assignments";
 
 	let { data }: PageProps = $props();
 
@@ -12,14 +14,38 @@
 
 <h1>Assignment #{data.assignment.id}</h1>
 <p>
-	Gravstedet, der skal vedligeholdes er ved <span class="address">{data.cemetaryPlot.address}</span
-	>.
+	Gravstedet, der skal vedligeholdes er ved
+	<span class="address">{data.cemetaryPlot.address}</span>.
 </p>
 <p>Vedligeholdelsen skal finde sted <time>{assignmentDate}<time>.</time></time></p>
+<p>State: {data.assignment.state}</p>
+
+<h2>Færdiggør opgave</h2>
+{#if canBeFinished(data.assignment)}
+	<p>Når du har færdiggjort opgaven, kan du uploade billederne her:</p>
+	<form method="POST" action="?/finish" enctype="multipart/form-data" use:enhance>
+		<label>
+			Billeder:
+			<input type="file" name="images" accept=".jpg, .jpeg, .png, .webp" required multiple />
+		</label>
+		<label>
+			Ekstra bemærkninger:
+			<textarea name="notes" placeholder="F.eks.: Vi løb tør for roser (?). De kommer i overmorgen :)"
+			></textarea>
+		</label>
+		<button>Færddigør job</button>
+	</form>
+{:else}
+	<p>Du har færddigjort denne opgave!</p>
+{/if}
 
 <style>
 	.address,
 	time {
 		font-weight: bold;
 	}
+
+	label {
+		display: block;
+	}
 </style>